<!--个人中心-->
<template>
  <div>
    <span style="color: grey">当前位置 >> 个人中心管理 >> 登录信息修改</span>

    <el-card style="width: 40%;margin-top:20px ">
      <el-form ref="form" :model="form" label-width="80px">
        <el-form-item label="登录名">
          <el-input v-model="form.username"></el-input>
        </el-form-item>
        <el-form-item label="密码">
          <el-input v-model="form.password"></el-input>
        </el-form-item>
        <el-form-item label="权限" v-if="form.sign === '0' ">
          <el-input model-value="普通管理员" disabled></el-input>
        </el-form-item>
        <el-form-item label="权限" v-if="form.sign === '1' ">
          <el-input model-value="超级管理员" disabled></el-input>
        </el-form-item>
      </el-form>
      <div style="text-align: center">
        <el-popconfirm title="确认修改吗?" @confirm="update">
          <template #reference>
            <el-button type="primary">修改</el-button>
          </template>
        </el-popconfirm>
      </div>

    </el-card>
  </div>
</template>

<script>
import request from "../utils/request";


export default {
  name: "",
  data() {
 return {
      loadering: true,
      form: {
        token: ''
      }
    }
  },
  async created() {
    let str = localStorage.getItem("user") || "{}"
    let id = JSON.parse(str).id
    const res = await request.get(`/user/` + id)
    this.form = res.data
    this.form.token = JSON.parse(str).token
  },
  methods: {
    update() {
      request.put(`/user`, this.form).then(res => {
        if (res.code === '200') {
          this.$message({
            type: "success",
            message: "更新成功"
          })
          //更新localStorage
          localStorage.setItem("user", JSON.stringify(this.form))
          this.$router.push("/personalCenter")
        } else if (res.code === '201') {
          this.$message.error("用户名已存在");
        }
      }).catch(res => {
        this.$message.error("服务器错误!请联系管理员或重新尝试");
      })
    }
  }
}
</script>

<style scoped>

</style>
